import React, {Component} from 'react';
import cs from 'classnames'
import BaseCmpt from '../BaseCmpt';
import './index.css';

class HomeCatList extends BaseCmpt {

    static defaultProps = {
        data: {
            type: 104,
            isOnly: true,
            style: {
                marginBottom: '10px'
            },
            dataset: {},
            layout: {
                columnNum: 5,
            },
        }
    };


    constructor(props) {
        super(props);
    }

    render() {
        var {onSelected, selected, data} = this.props;
        var {dataset, style, layout} = data;
        var columnNum = (layout ? layout.columnNum : 5) || 5;
        var shape = (layout ? layout.shape : 0) || 0;

        return (
            <div
                onClick={(e) => {
                    onSelected && onSelected(e)
                }}
                className={cs({'homeCatList cmptEle': true, 'cmptEle_selected': selected})}
                style={style}
            >
                {
                    dataset && dataset.length > 0 ?
                        dataset.map(function (item, index) {
                            return (
                                <div className="homeCatList__item" key={'homeCatList__item' + index}
                                     style={{width: (100 / columnNum + '%')}}>
                                    <img
                                        src={item.img_url}
                                        className="homeCatList__item__img"
                                        style={{borderRadius: (shape == 1 ? '0' : (shape == 2 ? '5px' : '50%'))}}
                                    />
                                    <div className="homeCatList__item__name">{item.cat_name}</div>
                                </div>
                            );
                        })
                        :
                        <div className="homeCatList__empty">还没有配置数据哦~</div>
                }
            </div>
        );
    }
}

export default HomeCatList;
